Every Context object comes with a Provider React component that allows consuming components to subscribe to context changes.
The Provider in the Context API aims to provide the state that we want to share to all components that are descendants of it in the component tree. It acts as a wrapper around a component tree and allows all tree components to access the shared data without needing to pass it as props explicitly.
The provider's job is to override the default values, essentially providing a dependency injection mechanism to the React component tree.
The Provider component accepts a value prop to be passed to consuming components that are descendants of this Provider.
All consumers that are descendants of a Provider will re-render whenever the Provider’s value prop changes.
The propagation from Provider to its descendant consumers (including .contextType and useContext) is not subject to the shouldComponentUpdate method, so the consumer is updated even when an ancestor component skips an update.
Changes are determined by comparing the new and old values using the same algorithm as Object.is (value and reference both)
One Provider can be connected to many consumers.
Providers can be nested to override values deeper within the tree.